<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
    xmlns:pm="http://primefaces.org/mobile"
    xmlns:ui="http://java.sun.com/jsf/facelets">
    
    <f:view renderKitId="PRIMEFACES_MOBILE" />
    
    <h:head>
		<link rel="stylesheet"
				href="#{request.contextPath}/resources/css/hotellie.css"/>
		<link rel="stylesheet"
				href="#{request.contextPath}/resources/css/bootstrap.css"/>
		<link rel="stylesheet"
				href="#{request.contextPath}/resources/css/font-awesome.css"/>
    </h:head>
    
    <h:body>
        
        <pm:page id="first">
            
            <pm:content>
            <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed' rel='stylesheet' type='text/css'/>
            <style>
      		      .dateHms {
    				font-size: 12px;
    				width:100%;
				  }
				  
				  .ui-body{padding:0em 0em}
				  
				  .table{
                     border-spacing:0px;
                  }
                  .ui-icon-delete{
                  	line-height:1;
                  }
                  .headerRow{
                  	margin-bottom:3em !important;
                  }
            </style>
                <h:form id="main">
                		<h:outputText  value="Welcome #{facebookBean.pullUserInfo()}" style="display:none;"   />
                
                <h:outputText  value="Welcome #{facebookBean.profile.firstName}"   rendered="#{not empty facebookBean.profile.firstName}"  />
          		<div class="row headerRow">
          			<div class="col-xs-2">
          				<a href="#panel-1" data-role="button" data-icon="bars" data-iconpos="notext" data-inline="true"></a>
						<div data-role="panel" id="panel-1" data-display="overlay">
							<ul data-role="listview" id="listview-1">
								<li><a href="about.xhtml">About</a></li>
							</ul>
						</div>
          			</div>
					<div class="col-xs-3">
					   <p:commandLink action="index.xhtml">
					   <ui:remove>
					   	<p:graphicImage value="../#{request.contextPath}/resources/image/logo.gif" style="height: 2.8em;padding-top: .5em;"/>
					   </ui:remove>
					   <h3>Hotellie</h3>
						</p:commandLink>
					</div>
          		</div>
                              
                
                    <p:growl id="messages" showDetail="true" />
                    <p:autoComplete id="acSimple" value="#{searchView.searchBean.placeBean.placeName}"  placeholder="Enter destination" completeMethod="#{locationAutoCompleteText.completeText}" />

                    <h:panelGrid columns="2" styleClass="dateHms">
                      <p:panel header="Check-in Date" styleClass="dateBox" >
                  	     <p:calendar  pattern="MM/dd/yyyy" value="#{searchView.searchBean.placeBean.fromDate}" mindate="#{searchView.searchBean.placeBean.currentDate}"/>
                  	  </p:panel>
                  	  <p:panel header="Check-out Date" styleClass="dateBox">
                  	      <p:calendar  pattern="MM/dd/yyyy" value="#{searchView.searchBean.placeBean.toDate}" mindate="#{searchView.searchBean.placeBean.currentDate}"/>
                  	  </p:panel>    
                    </h:panelGrid>
                    
                    <p:commandButton value="Search" styleClass="btn btn-primary" icon="search" action="#{searchView.search()}" />
                    <div class="row signIn">
                    	<div class="col-xs-6">
                    		<p:commandLink value="SignIn" action="#{signInUserView.signInUserMain()}" rendered="#{empty facebookBean.profile.firstName}" />
                    	</div>
                    	<div class="col-xs-6">
                    		<p:commandLink value="SignUp" action="/user/signUp.xhtml" rendered="#{empty facebookBean.profile.firstName}" />
                    	</div>
	                </div>
                </h:form>
            </pm:content>
            
            <pm:content styleClass="jqm-content">
     
			  
			 
			</pm:content>
			 
		
            
            
        </pm:page>

    </h:body>
    
</html>